{extend name='base' /}
{block name='content' /}
<!--tab标签-->
<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-tab layui-tab-brief">
            <ul class="layui-tab-title">
                <li class="layui-this">信访记录</li>
            </ul>
            <div class="layui-tab-content">
                <div class="layui-tab-item layui-show">
                    <form class="layui-form layui-form-pane" action="{:url('admin/project/index')}" method="get">
                    </form>
                    <hr>
                    <form class="layui-form" action="">
                       <table class="layui-table" lay-size="sm">
    <thead>
    <tr>
        <th style="width: 30px;">ID</th>
        <th>姓名</th>
        <th>身份证号</th>
        <th>电话号码</th>
        <th>省</th>
        <th>市</th>
        <th>区</th>
        <th>驳回原因</th>
        <th>图片</th>
        <th style="width: 130px;">创建时间</th>
        <th>状态</th> <!-- 添加状态列 -->
        <th style="width: 120px;">操作</th>
    </tr>
    </thead>
    <tbody>
    {foreach name="record_list" item="vo"}
    <tr>
        <td>{$vo.id}</td>
        <td>{$vo.name}</td>
        <td>{$vo.idcard}</td>
        <td>{$vo.contact}</td>
        <td>{$vo.province}</td>
        <td>{$vo.city}</td>
        <td>{$vo.district}</td>
        <td>{$vo.reason}</td>
        <td>
        {volist name="vo.files" id="file"}
        <img src="/public/uploads/{$file}" style="max-width: 100px; max-height: 100px; margin: 5px;">
        {/volist}
        </td>
        <td>{$vo.create_time}</td>
        <td>
            {if $vo.status == 0}
                处理中
            {elseif $vo.status == 1}
                已处理
            {else}
                已驳回
            {/if}
        </td>
        <td style="width:200px;display:felx">
     
    <button type="button" class="layui-btn layui-btn-sm view-content" data-content="{$vo.content}">查看</button>
    <button type="button" class="layui-btn layui-btn-sm change-status" data-id="{$vo.id}" data-status="1">处理</button>
    <button type="button" class="layui-btn layui-btn-sm reject-status" style="background-color:red" data-id="{$vo.id}" data-status="2">驳回</button>

        </td>
    </tr>
    {/foreach}
    </tbody>
</table>
                    </form>
                    <!--分页-->
                    {$record->render()}
                </div>
            </div>
        </div>
    </div>
</div>
{/block}
{block name="js"}
<script>
layui.use(['layer', 'form', 'upload'], function() {
    var $ = layui.jquery, layer = layui.layer, upload = layui.upload;
    var form = layui.form;

    // 数据导入
    var uploadInst = upload.render({
        elem: "#import",
        url: "{:url('admin/tbb/import')}",
        accept: 'file',
        before: function(obj) {
            layer.load();
        },
        done: function(res, index, upload) {
            layer.closeAll('loading');
            layer.msg('导入成功');
            setTimeout(function() {
                window.location.reload();
            }, 1500);
        },
        error: function(index, upload) {
            layer.closeAll('loading');
        }
    });

    // 通用删除
    $('.ajax-delete').on('click', function() {
        var _href = $(this).attr('href');
        layer.open({
            shade: false,
            content: '确定删除？',
            btn: ['确定', '取消'],
            yes: function(index) {
                $.ajax({
                    url: _href,
                    type: "get",
                    success: function(info) {
                        if (info.code === 1) {
                            setTimeout(function() {
                                location.href = info.url;
                            }, 1000);
                        }
                        layer.msg(info.msg);
                    }
                });
                layer.close(index);
            }
        });

        return false;
    });

    // 查看内容
    $('.view-content').on('click', function() {
        var content = $(this).data('content');
        layer.open({
            type: 1,
            title: '诉求内容',
            area: ['500px', '300px'],
            shadeClose: true,
            content: '<div style="padding: 20px;">' + content + '</div>'
        });
    });

    // 更改状态
    $('.change-status').on('click', function() {
        var id = $(this).data('id');
        var status = $(this).data('status');
        $.ajax({
            url: "{:url('admin/tbb/changeStatus')}",
            type: "post",
            data: {id: id, status: status},
            success: function(res) {
                if (res.code === 1) {
                    layer.msg('状态更新成功');
                    setTimeout(function() {
                        window.location.reload();
                    }, 1000);
                } else {
                    layer.msg(res.msg);
                }
            }
        });
    });

    // 驳回状态
    $('.reject-status').on('click', function() {
        var id = $(this).data('id');
        var status = $(this).data('status');
        layer.prompt({
            formType: 2,
            title: '请输入驳回理由',
            area: ['300px', '150px'] //自定义文本域宽高
        }, function(value, index, elem){
            $.ajax({
                url: "{:url('admin/tbb/rejectStatus')}",
                type: "post",
                data: {id: id, status: status, reason: value},
                success: function(res) {
                    if (res.code === 1) {
                        layer.msg('状态更新成功');
                        setTimeout(function() {
                            window.location.reload();
                        }, 1000);
                    } else {
                        layer.msg(res.msg);
                    }
                }
            });
            layer.close(index);
        });
    });
});

</script>
{/block}
